<template>
    <a-modal v-if="visible" class="fillmaskModal" title="新建任务模板" :width="1500" :visible="visible"
        :confirmLoading="confirmLoading" @ok="handleOk" @cancel="handleCancel" cancelText="取消"
        wrapClassName="ant-modal-cust-warp" style="top:5%;height: 90%;overflow-y: hidden">
        <div>
            <a-form :form="form" style="max-width: 50%;  margin: 30px auto 0;">
                <!-- 请输入任务名称 -->
                <a-form-model-item label="模板名称" prop="请输入模板名称">
                    <a-input :value="plaVal" @change="handleval" placeholder="请输入内容" />
                </a-form-model-item>

                <!-- 填报标准 -->
                <a-form-model-item label="请选择填报标准">
                    <a-select :default-value="acv" @change="handleSelectop">
                        <a-select-option value="GRI">GRI</a-select-option>
                        <a-select-option value="TCTD">TCTD</a-select-option>
                        <a-select-option value="ISSB">ISSB</a-select-option>
                    </a-select>

                </a-form-model-item>
            </a-form>
            <div>
                <a-card :bordered="true">
                    <a-steps class="steps" type="navigation" :style="stepStyle" v-model="currentTab" @change="changeStep"
                        simple>

                        <!-- <a-steps v-model:current="current" type="navigation" size="small" :style="stepStyle"> -->
                        <a-step title="部门架构" :disabled="true"/>
                        <a-step title="企业指标" :disabled="true" />
                        <!-- <a-step title="生成模板" /> -->

                    </a-steps>
                    <div class="content">
                        <Architecture v-if="currentTab === 0" @nextStep="nextStep" />
                        <EnterpriseIndex v-else-if="currentTab === 1" @nextStep1="nextStep1" @prevStep="prevStep" />
                        <!-- <TemplateGeneration v-else-if="currentTab === 1" :selectArr="selectArr" @prevStep="prevStep" /> -->
                    </div>
                </a-card>
            </div>
        </div>
    </a-modal>
</template>

<script>

// 部门架构
import Architecture from './Architecture'

// 企业指标
import EnterpriseIndex from './EnterpriseIndex'

// 生成模板
// import TemplateGeneration from './TemplateGeneration'


export default {
    data() {
        return {
            name: '',
            form: null,  // 手机表单中的数据
            visible: false,
            confirmLoading: false,
            currentTab: 0,
            selectArr: [],
            acv: 'GRI',
            stepStyle: {
                marginBottom: '60px',
                boxShadow: '0px -1px 0 0 #e8e8e8 inset',
                //backgroundColor:'',
                borderTop: '2px #333 blue'
            },
            // 获取当前时间
            currentDate: '',
            // 获取数组的长度
            tableLength: 0,
            plaVal: "",

            opVal: '',
            type: '',
            result: {},
            arrLength: ''
        }
    },

    created() {
        this.form = this.$form.createForm(this)

    },
    components: {
        Architecture,
        EnterpriseIndex,
        // TemplateGeneration
    },
    mounted() {

        this.$bus.$on('aaa', (a) => {
            this.currentTab = a

        });

        this.getCurrentDate()

        this.$bus.$on('getLength', (params) => {
            // console.log(params, 'params,//////////')
            this.tableLength = params
        })

        this.$bus.$on('tabAryLength', (params) => {
            this.arrLength = params
        })

        this.$bus.$emit('currentTab', this.currentTab)

    },
    methods: {
        handleval(e) {
            this.plaVal = e.target.value
        },
        // 父组件调用方法
        add(res, type) {
            this.type = type
            // this.$refs.input.value = res.name
            if (type == 2) {
                this.result = res
                this.plaVal = res.creator

            } else if (type == 1) {
                this.plaVal = ''
            }
            // console.log(this.$refs.inputs)
            this.visible = true
            this.currentTab = 0
        },
        handleSelectop(a) {
            this.acv = a
        },

        // 获取当前的时间
        getCurrentDate() {
            const date = new Date();
            const year = date.getFullYear();
            const month = String(date.getMonth() + 1).padStart(2, '0');
            const day = date.getDate();
            this.currentDate = `${year}-${month}-${day}`
        },
        // 点击确定
        handleOk() {
            let res = JSON.parse(localStorage.getItem('data'))
            console.log(res)
            let result = {
                type: 1,
                data: res
            }
            localStorage.setItem('tableData', JSON.stringify(result))

            this.confirmLoading = true;
            let formInfo
            // let num
            // if (this.arrLength >= 3) {
            //     num = 1
            // }
            // if (num == 1) {
            //     console.log(this.type)
            //     let index = this.arrLength++
            //     let indexSer = index += 1
            //     formInfo = {
            //         serialNumber: indexSer,
            //         name: this.acv,
            //         timer: this.currentDate,
            //         creator: this.plaVal,
            //         action: ['edit', 'del'],
            //         type: 1
            //     }
            // }
            if (this.type == 1) {

                console.log(2)
                let index = this.tableLength++
                let indexSer = index += 1


                formInfo = {
                    serialNumber: indexSer,
                    name: this.acv,
                    timer: this.currentDate,
                    creator: this.plaVal,
                    action: ['edit', 'del'],
                    type: 1
                }

            } else if (this.type == 2) {

                formInfo = {
                    serialNumber: this.result.serialNumber,
                    name: this.acv,
                    timer: this.currentDate,
                    creator: this.plaVal,
                    action: ['edit', 'del'],
                    type: 2,
                }
            }
            //     console.log(111111111111)
            //     let indexSer = this.arrLength+1
            //     formInfo = {
            //         serialNumber: indexSer,
            //         name: this.acv,
            //         timer: this.currentDate,
            //         creator: this.plaVal,
            //         action: ['edit', 'del'],
            //         type: 1
            //     }
            // }
            this.plaVal = ""
            this.type = ''



            // 通过自定义传递参数
            this.$emit('formInfo', formInfo)

            // this.form.validateFields((err, values) => {

            //     // console.log(values,'/////1111')
            //     if (!err) {
            //         // 整理数据
            //         let index = this.tableLength++
            //         // console.log(index, 'indexindexindexindex')
            //         let indexSer = index += 1
            //         // console.log(indexSer, 'indexSerindexSerindexSer')
            //         let formInfo = {
            //             serialNumber: indexSer,
            //             name: this.acv,
            //             timer: this.currentDate,
            //             creator: values.taskName,
            //             action: ['edit', 'del']
            //         }

            //         // 通过自定义传递参数
            //         this.$emit('formInfo', formInfo)
            //         // console.log(values.taskName, 'valuesvaluesvalues/////////')
            //         // console.log(values.standard, 'standardstandardstandard/////////')
            //     }
            // })
            setTimeout(() => {
                this.visible = false;
                this.confirmLoading = false;
            }, 500);
        },
        // 点击取消
        handleCancel() {
            this.visible = false;
        },

        changeStep(current) {
            // this.currentTab = current;
            // console.log(current, 6666)
        },

        prevStep() {
            if (this.currentTab > 0) {
                this.currentTab -= 1
            }
        },
        nextStep(value) {
            this.currentTab = 1
            this.stepObj = value
            // console.log(value, 6666)
        },
        nextStep1(value) {
            this.selectArr = value
            this.currentTab = 2
        },
    }
}
</script>

<style lang="scss" >
.fillmaskModal .ant-modal-body {
    padding-top: 0px !important;
    padding-left: 0;
    padding-right: 0;
    overflow-x: hidden;
}

.fillmaskModal .ant-spin-nested-loading {
    padding: 12px 24px !important;
}

.fillmaskModal .ant-select-selection-selected-value {
    font-size: 14px;
}
</style>